<template>
	<view class="common-text-size">
		<view class="head" v-if="wxInfo.data != null">
			<view class="auth-list">
				<view>
					<image :src="wxInfo.data.avatar" class="circle"></image>
				</view>
				<view class="show-inline">
					<text>{{wxInfo.data.nickname}}</text>
					<uni-tag type="error" inverted="true" circle="true" text="已授权"></uni-tag>
				</view>
			</view>
		</view>
		<view v-else style="text-align: center;">
			<image :src="qr" style="width: calc(70vw); height: calc(70vw);"></image>
			<p class="font-color small-common-text-size">请在两分钟内扫码关注</p>
			<button class="mt-2" type="default" @click="wxAuth">添加微信授权</button>
		</view>
	</view>
</template>

<script>
	import uniTag from "@/components/uni-tag/uni-tag.vue"
	export default {
		components: {
			uniTag
		},
		data() {
			return {
				qr: "",
				topic: "",
				userId: "",
				wxInfo: {},
				monitory: Object,
			}
		},
		methods: {
			monitoryAuth() {
				let a = 0;
				let _this = this;
				this.monitory = setInterval(() => {
					a++;
					_this.$http({url: `/wx/user/${_this.userId}`}).then(response => {
						let data = response.data.data;
						if (data === 1) {
							clearInterval(_this.monitory);	
							uni.showToast({
								icon: "success",
								title: "扫码成功",
								complete() {
									_this.getWxInfo();
								}
							})
						}
					});
					if (a === 60) {
						clearInterval(_this.monitory);
						uni.showToast({
							icon: "none",
							title: "微信二维码过期，请从新获取"
						})
						_this.qr = ""
					}
				}, 2000);
			},
			wxAuth() {
				let _this = this;
				_this.$http({
					url: `/weixin/getTicket/${this.userId}`,
					method: "POST"
				}).then(response => {
					let data = response.data;
					clearInterval(_this.monitory);
					_this.monitoryAuth();
					_this.qr = data.data.ticket

				});
			},
			getWxInfo() {
				let _this = this;
				_this.$http({
					url: `/wx/user/localinfo/${this.userId}`,
					method: "POST"
				}).then(response => {
					let data = response.data;
					_this.wxInfo = data
				});
			}
		},
		onLoad(e) {
			if (e.title != null) {
				uni.setNavigationBarTitle({
					title: e.title
				})
				this.topic = e.title;
				this.userId = e.userId;
				this.getWxInfo();
			}
		}
	}
</script>

<style>
	@import url("/static/css/common.css");

	.auth-list {
		display: flex;
		justify-content: space-between;
	}

	.auth-list image {
		width: calc(30vw);
		height: calc(30vw);
	}
</style>
